<template>
    <Breadcrumb :topCategoryInfo="topCategoryInfo" />
    <Banner />
    <Item :topCategoryInfo="topCategoryInfo" />
</template>

<script setup>
import { storeToRefs } from 'pinia';
import { useCategoryStore } from '@/stores/category';
import Breadcrumb from './components/breadcrumb.vue';
import Banner from './components/banner.vue';
import Item from './components/item.vue';

const categoryStore = useCategoryStore();
const { topCategoryInfo } = storeToRefs(categoryStore);

// 获取参数
const route = useRoute()
const router = useRouter()

watch(() => route.params.id,
    (newVal, oldVal) => {
        // 一级路由
        if (router.currentRoute.value.fullPath.split('/').length === 3) {
            categoryStore.getTopCategoryInfo(newVal);
        }
    },
    { immediate: true }
)

onMounted(() => {
    categoryStore.getBannerList({ distributionSite: '2' });
})
</script>

